<meta content="text/html; charset=UTF-8; X-Content-Type-Options=nosniff" http-equiv="Content-Type" />
<style type="text/css">
    #wp_header #header_layout .header_left_logo img{padding-top:5px; padding-left: 25px;}
    #wp_header #header_layout  ul {margin-top:20px;margin-right: 50px;}
    #wp_header #header_layout  ul li{float: left;margin-right: 20px;line-height: 14px; margin-top: 10px; cursor: pointer; }
    #wp_header #header_layout  .header_right_logo{padding-top: 8px;margin-right:25px;}
    #homepage_notificationBtn {position: relative;}
    #homepage_notificationBtn sup{color: #fff; position: absolute; font-size: 9px; top:-3px;left:10px; background: #ff0000;padding:1px;width:auto;}
</style>
<script src="js/user.api.js"></script>
<script src="js/alert.api.js"></script>
    <div id="header_layout" class="row">
        <div class="col_1_2 header_left_logo">
            <img src="imgs/topbar/workportLogo_190x50.png" alt="">
        </div>
        <div class="col_1_2 ">
            <div class="right wp_w_42 header_right_logo">
                <img src="imgs/topbar/starbucksLogo_42x42.png" alt="">
            </div>
            <div class="right wp_w_285 sm">
                <ul>
                    <li id="homepage_header_profileBtn">
                        <img src="imgs/20x20.png" class="wp_mt_1 wp_w_20 wp_h_20" alt="" onerror="this.src='imgs/20x20.png'" />
                    </li>
                    <li  id="homepage_header_searchBtn">
                        <i class="header_icon_a_20_20" title="Global search"></i>
                    </li>
                    <li id="homepage_notificationBtn">
                        <i class="header_icon_b_20_20" title="Alert notifications"></i>
                        <sup class='wp_h_12' style="line-height: 12px; text-align: center; display: none;min-width: 12px;"></sup>
                    </li>
                    <li id="homepage_header_helpBtn" title="Help">
                        <a href="html/WebHelp/index.htm" target="_blank"><i class="header_icon_c_20_20"></i></a>
                    </li>
                    <li id="homepage_header_setBtn">
                        <i class="header_icon_d_20_20" title="Settings – Coming Soon!"></i>
                    </li>
                    <li id="homepage_header_logOutBtn" title="Logout">
                        <i class="header_icon_f_20_20"></i>
                    </li>
                </ul>

            </div>
        </div>
    </div>
    <script type="text/javascript">
        WP_HEADER = $('#header_layout');

        var headerWinResponseSuccessCode = ['WP1022', 'WP1008'];
        Workport.AlertAPI.countAlert(function (data) {
            if ($.inArray(data.ResponseCode, headerWinResponseSuccessCode) > -1) {
                if (data.AlertCount != null && data.AlertCount.length > 0) {
                    var notificationCount = data.AlertCount[0].NotificationCount;
                    if (notificationCount > 0) {
                        $('#homepage_notificationBtn sup').show();
                        $('#homepage_notificationBtn sup').html(notificationCount);
                    }
                }
            } else {
                Workport.utils.alertMsg("Header", data.ResponseMessage, function(_data){});
            }
            setAppCount();
        });

        $('#homepage_header_logOutBtn').on({
            click:function(){
                window.location.href = window.location.href.replace('#', "") + '?cmd=logoff';
            }
        })

        var headerHtmlFunc = (function () {
            return {
                getUsers: function() {
                    Workport.UserAPI.getNetworkUser(function (data){
                        if (data) {
                            if (data.NetworkUsers) {
                                for (var index = 0; index < data.NetworkUsers.length; index++) {
                                    WP_USER_LIST.push({"id": data.NetworkUsers[index].UserId,"name": data.NetworkUsers[index].UserFullName + '(' + data.NetworkUsers[index].UserId + ')',"type":"U"});
                                }
                            }
                        } else {
                            Workport.utils.alertMsg(winTitle, data.ResponseMessage, function(_data){});
                        }
                    });
                },
                getCommunitys: function() {
                    Workport.UserAPI.getAccessUser(function (responseData){
                        if (responseData) {
                            if (responseData.UserAccessDetailsModel) {
                                for (var j = 0; j < responseData.UserAccessDetailsModel.length; j++) {
                                    if (responseData.UserAccessDetailsModel[j].ModeratorCommunities != null) {
                                        for (var i = 0 ; i < responseData.UserAccessDetailsModel[j].ModeratorCommunities.length; i++) {
                                            WP_COMMUNITY_LIST.push({"id":responseData.UserAccessDetailsModel[j].ModeratorCommunities[i].ID,"name":responseData.UserAccessDetailsModel[j].ModeratorCommunities[i].Name,"type":'C'});
                                        }
                                    }

                                    if (responseData.UserAccessDetailsModel[j].MemberCommunities != null) {
                                        for (var i = 0 ; i < responseData.UserAccessDetailsModel[j].MemberCommunities.length; i++) {
                                            WP_COMMUNITY_LIST.push({"id":responseData.UserAccessDetailsModel[j].MemberCommunities[i].ID,"name":responseData.UserAccessDetailsModel[j].MemberCommunities[i].Name,"type":'C'});
                                        }
                                    }
                                }
                            }
                        } else {
                            Workport.utils.alertMsg(winTitle, responseData.ResponseMessage, function(_data){});
                        }
                    });
                },
                getMentionUserList: function(_targetID, _type, _fLoadShow, _fLoadHide, _fCallbacks) {
                    if (_fLoadShow) {_fLoadShow();}
                    Workport.StreamAPI.getMentionUsers(function (data) {
                        if (_fLoadHide) {_fLoadHide();}
                        var mentionUsers = data.Users;
                        if (mentionUsers) {
                            if (_type == 'U') {
                                WP_NETWORK_USERS = mentionUsers;
                            } else {
                                WP_MENTION_COMM = mentionUsers;
                                if (_fCallbacks) {_fCallbacks();}
                            }
                        }
                    }, {targetID: _targetID, type: _type});
                }
            }
        })();
        
        Workport.UserAPI.getUserDetail(getLoginUserImage, true);
        function getLoginUserImage (data) {
            if ($.inArray(data.ResponseCode, headerWinResponseSuccessCode) > -1) {
                WP_USER_ID = data.UserBasicDetailsModel[0].AccountName.split("\\")[1];
                WP_USER_NAME = data.UserBasicDetailsModel[0].Name;
                var profileImage = $("#homepage_header_profileBtn img");
                profileImage.attr("src", data.UserBasicDetailsModel[0].UserImageURL);
                profileImage.prop('title', data.UserBasicDetailsModel[0].Name);

                headerHtmlFunc.getMentionUserList(WP_USER_ID, 'U');
            } else {
                Workport.utils.alertMsg("Header", data.ResponseMessage, function(_data){});
            }
            setAppCount();
        }

        headerHtmlFunc.getUsers();
        headerHtmlFunc.getCommunitys();
    </script>

